<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>主页信息</title>
</head>
<link href="${ctx}/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
<!--jqgrid插件-->
<!--jqgrid css-->
<link href="${ctx}/css/plugins/jqgrid/ui.jqgrid.css?0820" rel="stylesheet">
<link href="${ctx}/css/font-awesome.css?v=4.4.0" rel="stylesheet">

<!-- Morris -->
<link href="${ctx}/css/plugins/morris/morris-0.4.3.min.css" rel="stylesheet">

<!-- Gritter -->
<link href="${ctx}/js/plugins/gritter/jquery.gritter.css" rel="stylesheet">
<link href="${ctx}/css/animate.css" rel="stylesheet">
<link href="${ctx}/css/style.css?v=4.1.1" rel="stylesheet">

<body class="gray-bg">
    <div class="wrapper wrapper-content">
		<div class="row">
		<div class="ibox float-e-margins">
                    <div class="ibox-title">
                       <span>数据信息列表</span>
                    </div>
                    <div class="ibox-content" id="grid_content">
                        <table id="table_data_list"></table>
						<div id="paper_list"></div>
                    </div>
                </div>
		</div>
	</div>
</body>
<script src="${ctx}/js/jquery.min.js"></script>
<script src="${ctx}/js/bootstrap.min.js"></script>
<!--jqgrid js-->
<script src="${ctx}/js/plugins/jqgrid/i18n/grid.locale-cn.js?0820"></script>
<script src="${ctx}/js/plugins/jqgrid/jquery.jqGrid.min.js?0820"></script>
<script>
$(function(){
	 $.jgrid.defaults.styleUI = 'Bootstrap';
     $('#table_data_list').jqGrid({
         datatype : 'json',
         url : "${ctx}/Item/seeItems",
         mtype : 'POST',
         colNames: ["编号","标题","创建人","创建时间"],
         colModel: [
             {name: "id", index: "id", hidden:true},
             {name: "title", title: "project_num", width: 80},
             {name: "createdby", index: "createdby", width: 60, },
             {name: "createdon", index: "createdon", width: 60,formatter:"date", formatoptions: {newformat:'Y-m-d'}},
         ],
         height: 'auto',
         pager: "#paper_list",
         rowNum: 10,
         rowList: [10, 20, 30, 50, 100],
         multiselect: true,
         shrinkToFit: true,
         viewrecords : true,
         onSelectAll:function(aRowids,status){//多选触发事件

         },
         onSelectRow:function (rowid,status) {//单选行触发事件

         }
     })
     
     // 表格宽度调整
     function jqgridResize(width) {
         $('#table_data_list').setGridWidth(width);
     }
     // 表格宽度初始化
     jqgridResize($('#grid_content').width());
     // 表格宽度自适应
     $(window).bind('resize', function () {
         var width = $('#grid_content').width();
         jqgridResize(width);
     });
})
</script>
</html>